
<style>
    :not(:defined) {
        display: none;
    }
    #export_box:host{
      border:1px solid #191919;
    }
    /* Force the scroll bar to appear so we see it hide when overlay opens. */
    body::-webkit-scrollbar {
        background: lightgray;
    }
  
    body::-webkit-scrollbar-thumb {
        background: darkgray;
    }
   
    
    #top1{
          background: var(--icon-bg-color);
          text-align: center; 
          font-size: 16px;
          font-weight: bold;
          color: #fff;
          position: relative;
          border: none;
          padding: 2px;
      }
      #top1 img{
          position: absolute;
          right: 10px;
          top: 3px;
          cursor: pointer;
      }
      #container1{
        padding: 5px 0px 5px 0px;
        border: none;
        background-color: var(--main-bg-color);
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        width: 500px;
        z-index: 2;
        max-height:140px;
        overflow-y: auto;
        justify-content: center;
        user-select:none;
    }
    .dtext3{
        float: left;
        width: 30px;
        padding: 2px;
        color: #fff;
    }
    .val3{
        float: left;
        width: auto;
        padding: 2px;
        color: #fff;
        overflow: hidden;
    }
    .cb{
        display: none;
    }
  
  </style>
  <elix-dialog id="doc_box" aria-label="export svg" closed>
    <div id="top1"><h>参数检索</h><img src="./images/close.png" alt="" class="closeDoc"></div>
    <div id="container1">
        <div class="dtext3">厂站:</div><div id="name" class="val3">text发电厂</div>
        <div class="dtext3">间隔:</div><div id="jiange" class="val3">test设备</div>
        <div class="dtext3">设备:</div><div id="device" class="val3">test设备</div>
        <div class="dtext3">域名:</div><div id="yuming" class="val3">遥测值</div>
        <div class="dtext3" id="cb">常开:</div><div id="openkg" class="val3">遥测值</div>
        <div class="dtext3">状态:</div><div id="state" class="val3">遥测无效</div>
        <div class="dtext3">别名:</div><div id="index" class="val3">F01:L01:D01:yx01</div>
    </div>
  </elix-dialog>